<template>
	<view style="background-color: #f8f8f8; min-height: 100vh">
		<view class="empty-border" style="height:10px">

		</view>
		<view class="list" style="margin:10px;vorder: raduis 20px;">
			<uni-list>
				<uni-list-item v-if="item.Status === 1" v-for="(item, index) in activities" :key="index"
					direction="column">
					<template v-slot:header>
						<view class="slot-box" style="margin-top: 10px">
							<view class="main_title">{{ item.ActivityName }}</view>
							<view class="sub_title">简介：{{ item.ActivityDescription }}</view>
							<view class="sub_title">活动地点：{{ item.ActivityLocation }}</view>
						</view>
					</template>
					<template v-slot:body>
						<view class="slot-box">
							<view>开始时间：{{ formatTimestamp(item.ActivityDateTime_start) }}</view>
							<view>结束时间：{{ formatTimestamp(item.ActivityDateTime_end) }}</view>
						</view>
					</template>
					<template v-slot:footer>
						<view class="footer-hr">
							<view>人数限制{{ item.MaximumParticipants }}人</view>
							<view>
								<button :disabled="item.isRegistered" @click="baoming(item)">
									{{ item.isRegistered ? '已报名' : '报名' }}
								</button>
							</view>
						</view>
					</template>
				</uni-list-item>
			</uni-list>
		</view>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				uid: '',
				user_info: {},
				has_user_info: false,
				activities: []
			}
		},
		async onShow() {
			uni.showLoading({
				title: '加载中',
				mask: false
			});
			await this.load_user_info()
			await this.fetchActivities();
			uni.hideLoading()
		},
		methods: {
			async load_user_info() {
				const db = uniCloud.database();
				let {
					uid
				} = await uniCloud.getCurrentUserInfo()
				this.uid = uid;
				let {
					result
				} = await db.collection('abu_user_info').where({
					user_id: uid
				}).get();
				if (result.data.length != 0) {
					this.user_info = result.data[0]
					this.has_user_info = true
				} else {
					this.has_user_info = false
				}

			},
			async fetchActivities() {
				const db = uniCloud.database();
				let {
					result
				} = await db.collection('abu_activity').get();
				if (result.data) {
					const hd_db = db.collection("abu_baoming");
					const user_info = uniCloud.getCurrentUserInfo();

					for (const activity of result.data) {
						let res_data = await hd_db.where({
							ActivityName: activity._id,
							user_id: user_info.uid
						}).get({
							getOne: true
						});
						if (res_data.result.data != undefined) {
							activity.isRegistered = true
						} else {
							activity.isRegistered = false
						}
						console.log(activity.isRegistered);
					}
					this.activities = result.data;
				}
			},
			async baoming(item) {
				if (this.has_user_info) {
					uni.showLoading({
						title: '报名中',
						mask: false
					});
					const db = uniCloud.database();
					const hd_db = await db.collection("abu_baoming");
					// console.log(this.uid);
					const user_db = await db.collection("uni-id-users").where(`_id == "${this.uid}"`).field(
						"username,nickname").get()
					// console.log(user_db);
					// console.log(item);
					let {
						username, //手机号
						nickname, //真实姓名
					} = user_db.result.data[0]
					await hd_db.add({
						ActivityName: item._id,
						community_id: this.user_info.community_id,
						user_id: this.uid,
						Name: nickname || '未填写',
						Contact: username,
						RegistrationStatus: 0,
						Notes: ''
					}).then(res => {
						item.isRegistered = true
						uni.hideLoading()
						uni.showToast({
							title: '报名成功',
							icon: 'none'
						}).finally(res => {
							uni.navigateTo({
								url: './index',
								success: res => {},
								fail: () => {},
								complete: () => {}
							});
						})
					}).catch(res => {
						uni.showToast({
							title: '报名失败',
							icon: 'none'
						});
					})

				} else {
					uni.showModal({
						title: '提示',
						content: '您未填写用户信息',
						showCancel: false,
						cancelText: '',
						confirmText: '去填写',
						success: res => {
							if (res.confirm) {
								uni.navigateTo({
									url: `/uni_modules/abu_user_info/pages/abu_user_info/add?id=${item._id}`
								});
							} else {
								return
							}
						},
						fail: () => {},
						complete: () => {}
					});

				}

			},
			formatTimestamp(timestamp) {
				const date = new Date(timestamp);
				const year = date.getFullYear();
				const month = date.getMonth() + 1;
				const day = date.getDate();
				return `${year}-${month < 10 ? '0' + month : month}-${day < 10 ? '0' + day : day}`;
			}
		}
	}
</script>
<style>
	.slot-box {
		display: flex;
		flex-direction: column;
	}

	.main_title {
		font-size: 20px;
		font-weight: 700;
	}

	.sub_title {
		font-size: 14px;
		font-weight: 100;
	}

	.footer-hr {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
	}
</style>